<template>
	<view>
		<uni-list>
			<!-- 报修单编号 -->
			<uni-list-item title="报修单编号" :rightText="order.rid" />
			<!-- 报修单状态 -->
			<uni-list-item title="报修单状态" :rightText="status[order.status-1]" />
			<!-- 维修问题说明 -->
			<uni-list-item :title="order.rcontent" />
			<!-- 报修图片 -->
			<uni-list-item title="报修图片" />
			<view v-for="item in order.user_img">
				<image :src="item"></image>
			</view>
			<!-- 报修完成图片 -->
			<uni-list-item v-if="order.status != 1" title="修理图片" />
			<view v-if="order.status != 1" v-for="item in order.repairer_img">
				<image :src="item"></image>
			</view>
			<!-- 校区 -->
			<uni-list-item v-if="order.rarea===0" title="校区" rightText="广州校区东校园" />
			<uni-list-item v-if="order.rarea===1" title="校区" rightText="广州校区北校园" />
			<uni-list-item v-if="order.rarea===2" title="校区" rightText="广州校区南校园" />
			<uni-list-item v-if="order.rarea===3" title="校区" rightText="深圳校区" />
			<uni-list-item v-if="order.rarea===4" title="校区" rightText="珠海校区" />
			<!-- 报修时间 -->
			<uni-list-item title="报修时间" :rightText="order.rtime" />
			<!-- 期望解决时间 -->
			<uni-list-item title="期望解决时间" :rightText="order.datetimesingle" />
			<!-- 校区 -->
			<uni-list-item title="校区" :rightText="order.rarea" />
			<!-- 详细地址 -->
			<uni-list-item title="详细地址" :rightText="order.raddress" />
			<!-- 报修人编号 -->
			<uni-list-item title="报修人ID" :rightText="order.user_id" />
			<!-- 报修人姓名 -->
			<uni-list-item title="报修人姓名" :rightText="user.uname" />
			<!-- 报修人电话 -->
			<uni-list-item title="报修人电话" :rightText="user.uphone" />
			<!-- 维修人员编号 -->
			<uni-list-item v-if="order.status != 1" title="维修人员编号" :rightText="order.repairer_id" />
			<!-- 维修人员姓名 -->
			<uni-list-item v-if="order.status != 1" title="维修人员姓名" :rightText="repairer.uname" />
			<!-- 维修人员电话 -->
			<uni-list-item v-if="order.status != 1" title="维修人员电话" :rightText="repairer.uphone" />
		</uni-list>
		
		<!-- 修改信息按钮 -->
		<!-- <button class="button" @click="rewrite(order)">修改报修单信息</button> -->
		
	</view>
</template>

<script>
	export default{
		data() {
			return {
				order :{
					rid: 10001,  //保修单序号
					rarea: '珠海校区',  //校园
					raddress: '中山大学珠海校区荔园7号-223',  //详细地址
					rcontent: "维修信息描述1",  //报修详情
					rtime: '2022-10-6 15:31:06',  //预约时间
					repairer_id: 0,  //维修人员编号
					user_id: 10001,  //报修人编号
					status: 1,  //状态
					repairer_img: ["https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png"],  //完成图片
					user_img: ["https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png"],  //报修图片
					user_status: 2,  //用户权限
					repairer_status: 0  //维修人员权限？
				},
				// repairer: {
				// 	uid: 10001,
				// 	uname: "王老五",
				// 	uphone: "18923041690",
				// 	ulevel: 1
				// },
				// user: {
				// 	uid: 10001,
				// 	uname: "武磊",
				// 	uphone: "18923042418",
				// 	ulevel: 1
				// },
				// status: ['待分派', '待重新分派', '正在处理', '已结单'],
				// worker: ['王老五', '张老六', '徐长卿', '特朗普'],
				defaultWorker: 0,
				reason: ''
			}
		},
		onReady() {},
		onLoad(options) {
			var data = JSON.parse(options.order);
			console.log(data)
			this.order = data
		},
		methods: {
			bindPickerChange: function(e) {
				console.log('picker发送选择改变，携带值为', e.detail.value)
				this.defaultWorker = e.detail.value
			},
			rewrite(order) {
				console.log("跳转到报修单修改页面")
				uni.navigateTo({
					url:"./rewrite_order?order=" + JSON.stringify(order)
				});
			}
		}
	}
</script>

<style>
	.uni-list {
		background-color: #FFFFFF;
		position: relative;
		width: 100%;
		display: flex;
		flex-direction: column;
	}
	.uni-list-cell {
		position: relative;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		margin-top: 30rpx;
		margin-right: 20rpx;
		margin-bottom: 30rpx;
	}
	.uni-list-cell-left {
	    white-space: nowrap;
		font-size:28rpx;
		padding: 0 30rpx;
	}
	.button{
		width: 80%;
		margin-top: 30rpx;
		border-radius: 12px;
		border: "#FF0000"
	}
</style>